import React, { Component } from "react";
import { Switch, Route, Redirect, Link } from "react-router-dom";
import { Menu } from "antd";
import baseLine from "./baseLine";
import database from "./database";
import strategicDetail from "./detail";
import strategicHome from "./home";
import industrialcontrol from "./industrialcontrol";
import sites from "./sites";
import "./strategic.less";
class strategic extends Component {
  constructor(props) {
    super(props);
    this.state = {
      current: "1",
    };
  }
  handleClick = (e) => {
    console.log("click ", e);
    this.setState({
      current: e.key,
    });
  };
  render() {
    return (
      <div>
        <Menu
          className="nav"
          onClick={this.handleClick}
          selectedKeys={[this.state.current]}
          mode="horizontal"
        >
          <Menu.Item key="1">
            <Link to="/strategic">主机策略</Link>
          </Menu.Item>
          <Menu.Item key="2">
            <Link to="/strategic/industrialcontrol">工控策略</Link>
          </Menu.Item>
          <Menu.Item key="3">
            <Link to="/strategic/database">数据库策略</Link>
          </Menu.Item>
          <Menu.Item key="4">
            <Link to="/strategic/baseline">基线策略</Link>
          </Menu.Item>
          <Menu.Item key="5">
            <Link to="/strategic/sites">网站策略</Link>
          </Menu.Item>
        </Menu>

        <Switch>
          <Route path="/strategic" component={strategicHome} exact />
          <Route
            path="/strategic/industrialcontrol"
            component={industrialcontrol}
          />
          <Route path="/strategic/database" component={database} />
          <Route path="/strategic/baseline" component={baseLine} />
          <Route path="/strategic/sites" component={sites} />
          <Route path="/strategic/detail" component={strategicDetail} />
          <Redirect to="/strategic" />
        </Switch>
      </div>
    );
  }
}

export default strategic;
